<h2>Why is this an issue?</h2>
<p>Optional chaining allows to safely access nested properties or methods of an object without having to check for the existence of each intermediate
property manually. It provides a concise and safe way to access nested properties or methods without having to write complex and error-prone
<code>null</code>/<code>undefined</code> checks.</p>
<p>This rule flags logical operations that can be safely replaced with the <code>?.</code> optional chaining operator.</p>
<h2>How to fix it</h2>
<p>Replace with <code>?.</code> optional chaining the logical expression that checks for <code>null</code>/<code>undefined</code> before accessing the
property of an object, the element of an array, or calling a function.</p>
<h3>Code examples</h3>
<h4>Noncompliant code example</h4>
<pre data-diff-id="1" data-diff-type="noncompliant">
function foo(obj, arr, fn) {
    if (obj &amp;&amp; obj.value) {}
    if (arr &amp;&amp; arr[0])    {}
    if (fn &amp;&amp; fn(42))     {}
}
</pre>
<h4>Compliant solution</h4>
<pre data-diff-id="1" data-diff-type="compliant">
function foo(obj, arr, fn) {
    if (obj?.value) {}
    if (arr?.[0])   {}
    if (fn?.(42))   {}
}
</pre>
<h2>Resources</h2>
<h3>Documentation</h3>
<ul>
  <li> <a href="https://typescript-eslint.io/">typescript-eslint</a> - Rule <a
  href="https://github.com/typescript-eslint/typescript-eslint/blob/main/packages/eslint-plugin/docs/rules/prefer-optional-chain.mdx">prefer-optional-chain</a> </li>
  <li> MDN web docs - <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Optional_chaining">Optional chaining</a>
  </li>
</ul>
